<template>
    <div style="display:flex;justify-content:space-around;align-items:center;flex-direction:column;padding: 30px;height: 100%;">
        <div style="width: 100%">
            <p style="text-align:right;font-size: 14px;">本系列软件软著登记号 2020SR0066967(设备控制) 2020SR0066718(用户交互)
                <br/> 本自助打印设备专利号 ZL 202020290675.5
            </p>
            <p style="margin: 10px;font-size: 46px">点墨自助打印设备 <span
                    style="font-size: 18px;">{{$root.version}}</span></p>
        </div>

        <Alert type="error" show-icon>
            设备尚未初始化
            <div slot="desc">
                <p>欢迎您选用墨拓自助打印设备，请联系设备运维人员初始化设备信息，电话133-0535-6699。<br/>若您是运维人员，请准备并在下方正确录入您的统一身份登录代码与密钥。
                </p>
            </div>
        </Alert>

        <Row style="margin: 40px;width: 100%" :gutter="32">
            <Col span="8">
                <Alert show-icon>设备远端服务器serverUrl:(必须以 / 结尾)<Input v-model="serverUrl" style="padding: 5px"/></Alert>
                <Alert type="info" show-icon>
                    工作人员身份核验
                    <div slot="desc">
                        <div style="display:flex;flex-direction:column;">
                            请准确输入：
                            <Input v-model="username" placeholder="请输入管理员统一授权账号" style="padding: 5px"/>
                            <Input v-model="userPassword" placeholder="请输入管理员统一授权密码" style="padding: 5px"/>
                        </div>
                    </div>
                </Alert>
                <Button @click="doInit" type="success" icon="md-send" style="margin-top: 10px;">
                    <p>我对所有信息已仔细核查并确认无误</p>
                </Button>
            </Col>
            <Col span="8" style="display:flex;flex-direction:column;">
                deviceID:（请预先查询管理平台，严禁重复，必须以“D-”开头）
                <Input v-model="deviceID" placeholder="EG. D-CSU-01" style="padding: 10px"/>
                deviceName:
                <Input v-model="deviceName" placeholder="EG. 创业园自助设备01" style="padding: 10px"/>
                locationUniversityID:（请预先查询管理平台高校ID）
                <Input v-model="locationUniversityID" placeholder="EG. 1" style="padding: 10px"/>
                locationAddress:
                <Input v-model="locationAddress" placeholder="EG. 中南大学新校区研究生创业园C101" style="padding: 10px"/>
            </Col>
            <Col span="8" style="display:flex;flex-direction:column;">
                paperResidual（纸张初始化量）:（按实际填写）
                <Input v-model="paperResidual" placeholder="EG. 360" style="padding: 10px"/>
                tonerResidual（墨粉初始化寿命）:（按实际填写）
                <Input v-model="tonerResidual" placeholder="EG. 5200" style="padding: 10px"/>
                seleniumDrumResidual（硒鼓初始化寿命）:（按实际填写）
                <Input v-model="seleniumDrumResidual" placeholder="EG. 15600" style="padding: 10px"/>
                设备密码:（请务必将设备密码记录至设备随附维修卡并妥善保存！）
                <Input v-model="password" placeholder="进入本设备的管理模式需要输入此密码" style="padding: 10px"/>
            </Col>
        </Row>
        <Divider></Divider>
        <img src="../images/logo.png" width="180" style="margin: 10px;"/>
    </div>
</template>

<script>
    import * as axios from "axios";
    import Keyboard from '../components/Keyboard.vue';

    export default {
        components: {
            'v-keyboard': Keyboard,
        },
        data() {
            return {
                username: null,
                userPassword: null,
                deviceID: null,
                deviceName: null,
                locationUniversityID: null,
                locationAddress: null,
                paperResidual: null,
                tonerResidual: null,
                seleniumDrumResidual: null,
                password: null,
                serverUrl:null,
            }
        },
        name: "Init",
        mounted() {
            axios({
                method: 'get',
                url: 'http://localhost:8999/getBaseSetting',
            }).then((response) => {
                let responseData = response.data;
                if (responseData.state === "SUCCESS") {
                    if (responseData.code === "1") {
                        let data = JSON.parse(responseData.msg)
                        this.serverUrl = data["ServerUrl"];
                    }
                }
            });
        },
        methods: {
            doInit() {
                if(this.username==null||this.userPassword==null||
                this.deviceID==null||this.deviceName==null||this.locationUniversityID==null||this.locationAddress==null||
                this.paperResidual==null||this.tonerResidual==null||this.seleniumDrumResidual==null||this.password==null){
                    this.$Message.error("必须准确填写全部信息");
                    return;
                }
                axios({
                    method: 'post',
                    url: this.serverUrl + 'device/addNewPrinter',
                    data: {
                        username: this.username,
                        password: this.userPassword,
                        deviceID: this.deviceID,
                        deviceName: this.deviceName,
                        locationUniversityID: this.locationUniversityID,
                        locationAddress: this.locationAddress,
                        paperResidual: this.paperResidual,
                        tonerResidual: this.tonerResidual,
                        seleniumDrumResidual: this.seleniumDrumResidual,
                    }
                }).then(response => {
                    let responseData = response.data;
                    if (responseData.state == "SUCCESS") {
                        this.$Message.success("设备服务器注册成功！AUTHCODE-"+responseData.msg);
                        this.initDevice(responseData.msg);
                    } else {
                        this.$Message.error({
                            content: responseData.msg,
                            duration: 10,
                            closable: true
                        });
                    }
                }).catch((error) => {
                    console.log(error);
                    this.$Message.error(error);
                });
            },
            initDevice(authCode){
                axios({
                    method: 'get',
                    url: 'http://localhost:8999/init',
                    params: {
                        deviceID:this.deviceID,
                        authCode:authCode,
                        password:this.password,
                    }
                }).then(response => {
                    let responseData = response.data;
                    if (responseData.state == "SUCCESS") {
                        this.$Message.success(responseData.msg);
                    } else {
                        console.log(responseData.msg);
                        this.$Message.error(responseData.msg);
                    }
                }).catch((error) => {
                    console.log(error);
                    this.$Message.error(error);
                });
            }
        }
    }
</script>

<style scoped>

</style>